<template>
  <div>
    <input type="text" v-model.number="mag" />
    <input type="text" v-model.number="egg" />
    <button @click="add">+</button>
    <hr />
    <input type="text" @input="fn" v-model.trim="a" />
    <input type="text" v-model.lazy="b" />
  </div>
</template>

<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      mag: 1,
      egg: 2,
      a: "",
      b: "",
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    add() {
      console.log(this.mag + this.egg);
    },
    fn() {
      console.log(this.a);
    },
  },
};
</script>

<style scoped></style>
